<template>
    <div class="table">
        <div class="divSearch">
            <!--搜索框-->
            <Row>
                <Col :lg="{span:5}" :md="{span:8}" :sm="{span:16}" :xs="{span:22}">
                    <label class="searchLabel">填报年度:</label>
                    <Select v-model="searchModel.FillInYear" placeholder="全部" :label-in-value="true" @on-change="GetData()" class="searchInput">
                        <Option :value="item.DictText" v-for="item in CreateYearList" :key="item.DictValue">{{item.DictText}}</Option>
                    </Select>
                </Col>
                <Col :lg="{span:2}" :md="{span:2}" :sm="{span:2}" :xs="{span:2}" v-show="isFull">
                    <Button icon="ios-search" type="primary" @click="GetData()" class="searchButton">查询</Button>
                </Col>
                <Col :lg="{span:2}" :md="{span:2}" :sm="{span:2}" :xs="{span:2}" style="float:right">
                    <Button v-show="DataModel.ReportStatus>1" icon="ios-download" type="primary" @click="ExcelDown()" class="searchButton">数据导出</Button>
                </Col> 
                <Col :lg="{span:2}" :md="{span:2}" :sm="{span:2}" :xs="{span:2}" style="float:right" v-show="DataModel.ReportStatus<3&&isFull">
                    <Upload :on-success="handleSuccess" :action="GetPostUrl()">
                        <Button type="primary" icon="ios-cloud-upload-outline" class="searchButton">数据导入</Button>
                    </Upload>
                </Col>
                <Col :lg="{span:2}" :md="{span:2}" :sm="{span:2}" :xs="{span:2}"  style="float:right">
                    <Button icon="ios-cloud-download" type="primary" @click="TmpDown()" class="searchButton">模板下载</Button>
                </Col>
            </Row>
        </div>
        <Row>
            <Col>
                <div v-if="isFull">
                    <Form ref="DataModel" :model="DataModel" :rules="ruleModel" >
                        <table class="reportTable">
                            <caption>
                                <label style="float:left">(二){{searchModel.FillInYear}}蔬菜生产设施情况调查表(全面统计)——<span class="Tip">单位(亩)</span></label>
                                <label style="float:right">当前状态:
                                    <span v-if="DataModel.ReportStatus==0" class="Error">退回重报</span> 
                                    <span v-else-if="DataModel.ReportStatus==1" class="NoReport">未填写</span>
                                    <span v-else-if="DataModel.ReportStatus==2" class="AlreadyReport">已填写</span>
                                    <span v-else-if="DataModel.ReportStatus==3" class="UpReport">已上报</span>
                                    <span v-else-if="DataModel.ReportStatus==4" class="Success">审核通过</span>   
                                    <span v-else class="NoReport">无需填报</span>            
                                </label>
                            </caption>
                            <thead>
                                <tr>
                                    <td rowspan="2">设施蔬菜占地面积</td>
                                    <!-- <td rowspan="2">上年同期数</td> -->
                                    <!-- <td rowspan="2">比上年增减%</td> -->
                                    <td colspan="3">其中</td>
                                    <td rowspan="2">备注</td>
                                </tr>
                                <tr>
                                    <td>小棚蔬菜占地面积</td>
                                    <!-- <td>上年同期数</td> -->
                                    <!-- <td>比上年增减%</td> -->
                                    <td>大中棚蔬菜占地面积</td>
                                    <!-- <td>上年同期数</td> -->
                                    <!-- <td>比上年增减%</td> -->
                                    <td>温室蔬菜占地面积</td>
                                    <!-- <td>上年同期数</td> -->
                                    <!-- <td>比上年增减%</td> -->
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td> 
                                        <Poptip trigger="focus" >
                                            <Form-item prop="FacilitiesArea"><Input disabled v-model="DataModel.FacilitiesArea=FacilitiesArea"></Input></Form-item>
                                            <span slot="content">
                                                上年数据:{{DataModel.OldFacilitiesArea==null||""?"暂无":DataModel.OldFacilitiesArea}}
                                                ——
                                                增减比:{{getScale(DataModel.OldFacilitiesArea,DataModel.FacilitiesArea)}}
                                            </span>
                                        </Poptip>
                                    </td>
                                    <!-- <td class="disableTd"><Input v-model="DataModel.OldFacilitiesArea==null?'无':DataModel.OldFacilitiesArea" readonly disabled></Input></td> -->
                                    <!-- <td class="disableTd"><Input v-model="DataModel.FacilitiesArea" readonly disabled></Input></td> -->
                                    <td> 
                                        <Poptip trigger="focus" >                                    
                                            <Form-item prop="SmallArea"><Input v-model="DataModel.SmallArea"></Input></Form-item>
                                            <span slot="content">
                                                上年数据:{{DataModel.OldSmallArea==null||""?"暂无":DataModel.OldSmallArea}}
                                                ——
                                                增减比:{{getScale(DataModel.OldSmallArea,DataModel.SmallArea)}}
                                            </span>
                                        </Poptip>
                                    </td>
                                    <!-- <td class="disableTd"><Input v-model="DataModel.OldSmallArea==null?'无':DataModel.OldSmallArea" readonly disabled></Input></td> -->
                                    <!-- <td class="disableTd"><Input v-model="DataModel.FacilitiesArea" readonly disabled></Input></td> -->
                                    <td> 
                                        <Poptip trigger="focus" >                            
                                            <Form-item prop="BigArea"><Input v-model="DataModel.BigArea"></Input></Form-item>
                                            <span slot="content">
                                                上年数据:{{DataModel.OldBigArea==null||""?"暂无":DataModel.OldBigArea}}
                                                ——
                                                增减比:{{getScale(DataModel.OldBigArea,DataModel.BigArea)}}
                                            </span>
                                        </Poptip>
                                    </td>
                                    <!-- <td class="disableTd"><Input v-model="DataModel.OldBigArea==null?'无':DataModel.OldBigArea" readonly disabled></Input></td> -->
                                    <!-- <td class="disableTd"><Input v-model="DataModel.FacilitiesArea" readonly disabled></Input></td> -->
                                    <td> 
                                        <Poptip trigger="focus" >                            
                                            <Form-item prop="GreenhouseArea"><Input v-model="DataModel.GreenhouseArea"></Input></Form-item>
                                            <span slot="content">
                                                上年数据:{{DataModel.OldGreenhouseArea==null||""?"暂无":DataModel.OldGreenhouseArea}}
                                                ——
                                                增减比:{{getScale(DataModel.OldGreenhouseArea,DataModel.GreenhouseArea)}}
                                            </span>
                                        </Poptip>
                                    </td>
                                    <!-- <td class="disableTd"><Input v-model="DataModel.OldGreenhouseArea==null?'无':DataModel.OldGreenhouseArea" readonly disabled></Input></td> -->
                                    <!-- <td class="disableTd"><Input v-model="DataModel.FacilitiesArea" readonly disabled></Input></td> -->
                                    <td> <Form-item prop="Remark"><Input v-model="DataModel.Remark"></Input></Form-item></td>
                                </tr>
                            </tbody>
                        </table>
                    </Form>
                    <div class="divButton">
                        <!-- <Button type="primary" @click="save()">保存</Button>
                        <Button type="ghost" @click="cancel()" style="margin-left: 5px">取消</Button> -->
                        <Button type="primary" @click="save('DataModel')" :disabled="DataModel.ReportStatus < 3 && BtnSaveStatus ? false:true">保存</Button>
                        <Button type="primary" @click="DataUp(DataModel.ReportId)" :disabled="DataModel.ReportStatus == 2 ? false:true">上报</Button>
                    </div>
                </div>
                <div class="FIllTip" v-else>温馨提示:本时段不在系统报表填报时间内，请耐心等待。</div>
                <Alert class="alert" banner type="error">
                    <p>填报时间：每年1月10日</p>
                    <p>1.全省范围内从乡（镇）起，逐级全面统计，由县级填报经州（市）审核后上报。</p>
                    <p>2.设施占地面积指设施内面积，用于种植蔬菜的设施面积。</p>
                    <span slot="desc"></span>
                </Alert>
            </Col>
        </Row>
    </div>
</template>
<script>
export default {
    data() {
        const validateData=(rule, value, callback) => {
            var temp=/^[0-9]\d*(\.\d+)?$/;
            if(value!=null&&value!="")
            {
                if(temp.test(value)==false)
                {
                    callback(new Error('必须是大于0的数字'));
                }
                else{
                    callback();  
                }
            }else{
                callback();
            }
        };
        return {
            self: this,
            CreateYearList: this.GetGroupDict("ReportYear"), //周期
            CurrentYear: this.GetCurrentYear(),//当前年度
            BtnSaveStatus: false,//保存按钮开关
            isFull:false,
            //  SearchYear:'',
            //查询模型：根据需求删除不不要查询条件
            //蔬菜生产情况表代码
            searchModel: {
                Id: '',
                ReportCode: 'VegFacility',
                FillInYear: '',
                TimesType: '',
                AreaCode: this.GetlocaStorage("VegUserInfo").AreaCode,
                PageNumber: 1,
                PageSize: 20,
                Status: '',
                Opinion: ''
            },
            DataModel: {
                Id: '0',
                ReportId: '',
                FacilitiesArea: '',
                SmallArea: '',
                BigArea: '',
                GreenhouseArea: '',
                Remark: '',
                ReportStatus: '',
                //***********************上一年的数据
                OldId: '0',
                OldReportId: '',
                OldFacilitiesArea: '',
                OldSmallArea: '',
                OldBigArea: '',
                OldGreenhouseArea: '',
                OldReportStatus: '',
            },
            ruleModel:{
                FacilitiesArea: [{ validator: validateData, trigger: 'blur' }],
                SmallArea: [{ validator: validateData, trigger: 'blur' }],
                BigArea: [{ validator: validateData, trigger: 'blur' }],
                GreenhouseArea: [{ validator: validateData, trigger: 'blur' }]
            },
            ctx: this, //table数据上下文
            clientHeight: window.innerHeight - 270, //表格默认高度
            // postUrl: this.$http.defaults.baseURL + "Report/PostImportData?ReportCode="
            // postUrl+this.searchModel.ReportCode
        }
    },
     computed: { //菜地总面积
        // SeasonArea: {//季节性面积
        //     get: function () {
        //         var WSArea = this.DataModel.WSArea == null ? '' : Number(this.DataModel.WSArea);
        //         var SFArea = this.DataModel.SFArea == null ? '' : Number(this.DataModel.SFArea);
        //         return WSArea + SFArea;
        //     }
        // },
        FacilitiesArea: {
            get: function () {//蔬菜总面积
                var GreenhouseArea = this.DataModel.GreenhouseArea == null ? 0 : Number(this.DataModel.GreenhouseArea);
                //季节性蔬菜总面积
                // var SeasonArea = this.DataModel.SeasonArea == null ? '' : Number(this.DataModel.SeasonArea);
                var SmallArea = this.DataModel.SmallArea == null ? 0 : Number(this.DataModel.SmallArea);
                var BigArea = this.DataModel.BigArea == null ? 0 : Number(this.DataModel.BigArea);
                //水生蔬菜面积
                // var LiquidArea = this.DataModel.LiquidArea == null ? '' : Number(this.DataModel.LiquidArea);
                var total=Math.round((GreenhouseArea + SmallArea + BigArea)*100)/100 ;
                return total;
            }
        },
        OldFacilitiesArea: {
            get: function () {//蔬菜总面积
                var GreenhouseArea = this.DataModel.OldGreenhouseArea == null ? '' : Number(this.DataModel.OldGreenhouseArea);
                //季节性蔬菜总面积
                // var SeasonArea = this.DataModel.SeasonArea == null ? '' : Number(this.DataModel.SeasonArea);
                var SmallArea = this.DataModel.OldSmallArea == null ? '' : Number(this.DataModel.OldSmallArea);
                var BigArea = this.DataModel.OldBigArea == null ? '' : Number(this.DataModel.OldBigArea);
                var total =Math.round((GreenhouseArea + SmallArea + BigArea)*100)/100 ;
                //水生蔬菜面积
                // var LiquidArea = this.DataModel.LiquidArea == null ? '' : Number(this.DataModel.LiquidArea);
                return total ;
            }
        }
    },
    mounted() {
        //table高度计算方法
        const that = this;
        window.onresize = () => {
            return (() => {
                that.clientHeight = window.innerHeight - 220;
            })()
        };
    },
    methods: {
        //获取今往年数据
        GetData: function () {
            var self = this;
            var model = new Object();
            model.ReportCode = self.searchModel.ReportCode;
            if (self.searchModel.FillInYear != null && self.searchModel.FillInYear != '') {
                model.FillInYear = self.searchModel.FillInYear;
                self.isFull= self.IsFillForTableYear(parseInt(self.searchModel.FillInYear));
            } else {
                self.isFull= self.IsFillForTableYear(self.CurrentYear);   
                model.FillInYear = self.CurrentYear + '年';//填报年度-----数据字典值
                self.searchModel.FillInYear = self.CurrentYear + '年';
            }
            model.AreaCode = self.searchModel.AreaCode;
            self.DataModel={};//清空当前数据            
            self.$http.post("Report/PostData", model).then( //获取数据编辑项的值
                function (res) {
                    if (res.data.list.status == 2 || res.data.list.status == 1) {
                        self.DataModel = res.data.list.model;
                        self.BtnSaveStatus = true;
                    } else {
                        self.DataModel = res.data.list.model;
                        self.$Modal.warning({
                            title: "提示信息",
                            content: res.data.list.message
                        });
                        self.BtnSaveStatus = false;
                    }
                }
            );
        },
        //保存方法
        save(name) {
            var self = this;
            this.$refs[name].validate((valid) => {
                if (valid) 
                {
                    this.$http.put('VegFacility', self.DataModel).then(
                    function(res) {
                        if (res.data.status == 1) {
                            self.GetData();
                            self.$Notice.success({
                                title: '数据保存成功！',
                                desc: false
                            });
                        } else {
                            self.$Modal.warning({
                                title: "提示信息",
                                content: "更新失败,请与管理员联系!"
                            });
                        }
                    });
                    
                }
                else{
                    this.$Message.error('数据验证失败，请检查后再试!');
                }
            })
        },
        //数据上报
        DataUp() {
            var self = this;
            self.searchModel.Id = self.DataModel.ReportId;
            self.searchModel.Status = 3;
            self.searchModel.Opinion = '';
            self.$Modal.confirm({
                title: '提示信息',
                content: '<p>数据上报后，不能再更改，是否继续上报？</p>',
                onOk: () => {
                    this.$http.post("Report/PostUpStatus", self.searchModel).then(
                        function (res) {
                            if (res.data.status == 1) {
                                self.$Notice.success({ title: '数据上报成功！', desc: false });
                                self.GetData();
                            }
                            else {
                                self.$Modal.error({ title: "提示信息", content: "数据上报失败!" });
                            }
                        }
                    );
                }
            });
        },
        //模板下载
        TmpDown: function () {
            window.open(this.$http.defaults.baseURL + "Report/GetTemplateData?ReportCode=" + this.searchModel.ReportCode);
        },
        //导出
        ExcelDown:function(){
            var self = this;
            var model = new Object();
            model.ReportCode = self.searchModel.ReportCode;
            if (self.searchModel.FillInYear != null && self.searchModel.FillInYear != '') {
                model.FillInYear = self.searchModel.FillInYear;
            } else {
                model.FillInYear = self.CurrentYear + '年';//填报年度-----数据字典值
                self.searchModel.FillInYear = self.CurrentYear + '年';
            }
            model.AreaCode = self.searchModel.AreaCode;
            window.open(this.$http.defaults.baseURL + "VegFacility/GetExcelData?ReportCode=" + model.ReportCode+"&&FillInYear="+model.FillInYear+"&&AreaCode="+model.AreaCode);
        },
        //导入
        GetPostUrl(){
           var url= this.$http.defaults.baseURL + "Report/PostImportData?ReportCode="+this.searchModel.ReportCode+"&&AreaCode="+this.searchModel.AreaCode + "&&FillInYear=" + this.searchModel.FillInYear;
           return url;
        },
        handleSuccess(res, file) {
            var self = this;
            self.GetData();
            self.$Notice.success({
                title: '数据导入成功！',
                desc: false
            });
        },
    },
    //创建Vue页面方法
    created: function () {
        //创业Vue前调用获取this.datas: {},//table数据对象
        this.GetData();
    },
    watch: {
        //需要监听的在此处新增监听对象
    }
}
</script>
